<template>
    <div class="page_root" :key="queryUpdateFlag" data-page-name="日例会记录" data-page-identification="b_znrlucl2hq">
        <a-spin :spinning="pageLoading.loading" :tip="pageLoading.tip">
            <!-- begin vid_n3w75xcwj9 自定义模板_b38rw8qh0n -->
            <!--            新建日例会记录-->
            <a-modal
                :visible="state.addVisible"
                :title="state.modalTitle"
                centered
                :mask-closable="false"
                width="800px"
                @cancel="cancelMeet"
                @ok="confirmAdd"
                destroy-on-close
                :body-style="{
                    maxHeight: '800px',
                    overflowY: 'auto'
                }"
                :keyboard="false"
                :ok-button-props="{
                    loading: state.submitLoading
                }"
            >
                <div class="modal-form">
                    <a-form :model="state.addForm" ref="addRef" :rules="addRule">
                        <a-row>
                            <a-col :span="12">
                                <a-form-item name="areaCode" label="区域">
                                    <a-select
                                        v-model:value="state.addForm.areaCode"
                                        :placeholder="selectHolder"
                                        allow-clear
                                        show-search
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                        :options="state.areaNameList"
                                        @change="
                                            () => {
                                                state.addForm.factoryCode = undefined
                                                state.addForm.productLine = undefined
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item name="factoryCode" label="工厂">
                                    <a-select
                                        v-model:value="state.addForm.factoryCode"
                                        :placeholder="selectHolder"
                                        :options="state.factoryList"
                                        show-search
                                        @change="state.addForm.productLine = undefined"
                                        @focus="getProjectByArea"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item name="productLine" label="产品线">
                                    <a-select
                                        v-model:value="state.addForm.productLine"
                                        :options="state.productLineList"
                                        :placeholder="selectHolder"
                                        show-search
                                        allow-clear
                                        @focus="getProductLineByFactory"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12" v-if="currentTab === '周例会（已验收风险）'">
                                <a-form-item name="onlineUsageRate" label="在线使用率">
                                    <a-input-number
                                        style="width: 100%"
                                        :placeholder="inputHolder"
                                        v-model:value="state.addForm.onlineUsageRate"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12" v-if="currentTab === '日例会' || currentTab === '周例会（未验收风险）'">
                                <a-form-item name="projectPhase" label="项目阶段">
                                    <a-select
                                        v-model:value="state.addForm.projectPhase"
                                        :placeholder="selectHolder"
                                        show-search
                                        allow-clear
                                        :options="state.milepostList"
                                        @focus="getMilepostList"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col
                                :span="12"
                                v-if="currentTab === '周例会（已验收风险）' || currentTab === '周例会（未验收风险）'"
                            >
                                <a-form-item name="projectStatus" label="项目状态">
                                    <a-select
                                        v-model:value="state.addForm.projectStatus"
                                        :placeholder="selectHolder"
                                        show-search
                                        :options="state.statusList"
                                        @focus="getStatusList"
                                        allow-clear
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12" v-if="currentTab !== '日例会'">
                                <a-form-item name="riskStatus" label="风险状态">
                                    <a-select
                                        v-model:value="state.addForm.riskStatus"
                                        :options="state.fxztList"
                                        :placeholder="selectHolder"
                                        show-search
                                        allow-clear
                                        @focus="getProductLineByFactory"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>

                            <a-col :span="12">
                                <a-form-item name="reportTime" label="汇报时间">
                                    <a-date-picker
                                        v-model:value="state.addForm.reportTime"
                                        value-format="YYYY-MM-DD"
                                        style="width: 100%"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item name="customerManager" label="客成经理">
                                    <a-select
                                        v-model:value="state.addForm.customerManager"
                                        :options="state.allUser"
                                        :placeholder="selectHolder"
                                        show-search
                                        allow-clear
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <template v-if="currentTab === '日例会'">
                                <a-col :span="24">
                                    <a-form-item name="visitSituation" label="拜访/协同状态">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.visitSituation"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="projectPhaseEvents" label="项目阶段事件">
                                        <a-textarea
                                            v-model:value="state.addForm.projectPhaseEvents"
                                            :placeholder="inputHolder"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="trackingSituation" label="跟踪情况">
                                        <a-textarea
                                            v-model:value="state.addForm.trackingSituation"
                                            :placeholder="inputHolder"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                            </template>
                            <template v-if="currentTab === '周例会（区域风险）'">
                                <a-col :span="24">
                                    <a-form-item name="projectPhaseEvents" label="客情风险">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.projectPhaseEvents"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="trackingSituation" label="协同状态">
                                        <a-textarea
                                            v-model:value="state.addForm.trackingSituation"
                                            :placeholder="inputHolder"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                            </template>
                            <template v-if="currentTab === '周例会（未验收风险）'">
                                <a-col :span="24">
                                    <a-form-item name="visitSituation" label="项目风险">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.visitSituation"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="projectPhaseEvents" label="客情风险">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.projectPhaseEvents"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="trackingSituation" label="协同状态">
                                        <a-textarea
                                            v-model:value="state.addForm.trackingSituation"
                                            :placeholder="inputHolder"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                            </template>
                            <template v-if="currentTab === '周例会（已验收风险）'">
                                <a-col :span="24">
                                    <a-form-item name="visitSituation" label="项目风险">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.visitSituation"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="projectPhaseEvents" label="客情风险">
                                        <a-textarea
                                            :placeholder="inputHolder"
                                            v-model:value="state.addForm.projectPhaseEvents"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item name="trackingSituation" label="协同状态">
                                        <a-textarea
                                            v-model:value="state.addForm.trackingSituation"
                                            :placeholder="inputHolder"
                                            :rows="4"
                                        />
                                    </a-form-item>
                                </a-col>
                            </template>
                        </a-row>
                    </a-form>
                </div>
            </a-modal>
            <!--            新建日例会记录-->

            <div class="body">
                <div class="top-search">
                    <a-row :gutter="24">
                        <a-col :span="5">
                            <a-form-item label="区域" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="state.searchForm.areaCode"
                                    :options="state.areaNameList"
                                    placeholder="请选择"
                                    :field-names="{ label: 'label', value: 'value' }"
                                    :filterOption="
                                        (input, option) => {
                                            return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    @change="getData"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item label="客成经理">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="state.searchForm.customerManager"
                                    :options="state.allUser"
                                    placeholder="请选择"
                                    :filterOption="
                                        (input, option) => {
                                            return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    @change="getData"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>

                        <a-col :span="5">
                            <a-form-item label="汇报时间">
                                <a-date-picker
                                    style="width: 100%"
                                    v-model:value="state.searchForm.time"
                                    value-format="YYYY-MM-DD"
                                    @change="getData"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="2">
                            <a-space>
                                <a-button @click="resetData" ghost type="primary">重置</a-button>
                            </a-space>
                        </a-col>
                    </a-row>
                </div>
                <div class="content">
                    <a-tabs v-model:activeKey="currentTab" @change="tabChange">
                        <a-tab-pane v-for="tab in tabs" :key="tab" :tab="tab" />
                    </a-tabs>

                    <div class="table-top">
                        <div class="tip">例会记录</div>
                        <a-space>
                            <!--                                                    <a-button type="primary">生成分析</a-button>-->
                            <!--                                                    <a-button type="primary">分析记录</a-button>-->
                            <a-button type="primary" @click="showAdd">新建</a-button>
                        </a-space>
                    </div>
                    <div class="kb-table-box">
                        <a-table
                            :columns="tableColumns"
                            :dataSource="state.dataSource"
                            rowKey="areaName"
                            bordered
                            :pagination="pagination"
                            :loading="state.tableLoading"
                        >
                            <template #bodyCell="{ record, text, column, index }">
                                <template v-if="column.dataIndex === 'action'">
                                    <a-space :size="4">
                                        <a-button type="link" size="small" @click="handleEdit(record)">编辑</a-button>
                                        <a-divider type="vertical" style="background-color: #3875ff; margin: 0" />
                                        <a-popconfirm
                                            title="确定删除吗?"
                                            ok-text="确定"
                                            cancel-text="取消"
                                            @confirm="deleteRecord(record.id)"
                                            @cancel="cancel"
                                        >
                                            <a-button type="link" size="small">删除</a-button>
                                        </a-popconfirm>
                                    </a-space>
                                </template>
                            </template>
                        </a-table>
                    </div>
                </div>
            </div>
            <!-- end vid_n3w75xcwj9 自定义模板_b38rw8qh0n -->
        </a-spin>
    </div>
</template>
<script setup lang="tsx">
    import {
        h,
        ref,
        reactive,
        toRaw,
        markRaw,
        watch,
        computed,
        onBeforeMount,
        onMounted,
        onBeforeUnmount,
        onUnmounted,
        onActivated,
        onDeactivated
    } from 'vue'
    import { useRoute, useRouter } from 'vue-router'
    const router = useRouter()
    const route = useRoute()
    import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios'
    import {
        cloneDeep,
        localGet,
        merge,
        getDifferenceArray,
        traversalTreeStructure,
        checkCaseCondition,
        renderStringInTemplate,
        handleBreadcrumbJump,
        throttle,
        permission,
        getComponentParamsValue
    } from '@/utils/index'
    import { isNullOrEmpty, isEmptyArr, isNullOrUnDef, isContained, isArray, isEmpty, isObject } from '@/utils/is'
    import dayjs from 'dayjs'
    import { getPagePcChartsDataSourceConvert } from '@/utils/chart'
    import { message, notification, Modal } from 'ant-design-vue'
    import {
        propertyFormatByNumber,
        propertyFormatByPercentage,
        propertyFormatByDate,
        parseSubFromDataList
    } from '@/utils/format'
    import colorTheme from '@/design/custom-theme.json'
    /*** PUBLISH_EXEGESIS ***
 import UserTableRecords from '@/model/UserTableRecords';
 import { getAppBaseUrl } from '@/utils/index';
 import { sendToken } from "@/hooks/useIframeToken";
 import { useSystemStore } from "@/store/modules/system";
 const systemStore = useSystemStore();
 *** PUBLISH_EXEGESIS ***/

    // 获取传入的流程ID和组件参数
    const props = defineProps({
        'processInstanceId': {
            type: [String, Number, Boolean],
            default: undefined
        }
    })
    const immediateWatch = (source, callback) => {
        watch(source, callback, { deep: true, immediate: true })
    }

    /* -------------------------- 属性定义 -------------------------- */

    const setTimeOutList = []
    const pageLoading = reactive({
        loading: false,
        tip: undefined
    })
    const authInfo = localGet('app-user-store')

    // 处理校验
    const setSubFormName = (parentInfo, name) => {
        return [parentInfo.parents, parentInfo.cycleIndex, name]
    }

    /* ========================== 属性定义 ========================== */

    /* -------------------------- 元素数据引用 -------------------------- */

    /* ========================== 元素数据引用 ========================== */

    /* -------------------------- 页面数据 -------------------------- */

    /* ========================== 页面数据 ========================== */

    /* -------------------------- 响应 -------------------------- */

    /* ========================== 响应 ========================== */

    /* -------------------------- 函数 -------------------------- */

    /* ========================== 函数 ========================== */

    /* -------------------------- 页面参数 -------------------------- */

    const pageParameter_state = reactive({
        'processInstanceId': props.processInstanceId ?? route.query.processInstanceId
    })

    /* ========================== 页面参数 ========================== */

    /* -------------------------- 组件事件处理方法 -------------------------- */

    // ---------------------------- 组件数据同步 ----------------------------

    // ============================ 组件数据同步 ============================

    /* ========================== 组件事件处理方法 ========================== */

    /* -------------------------- 生命周期 -------------------------- */
    // 用于参数变更后重新执行自定义指令
    const queryUpdateFlag = ref(0)
    onMounted(() => {})

    onUnmounted(() => {
        // 销毁定时器
        setTimeOutList.forEach(({ repeat, timer }) => {
            repeat ? clearInterval(timer) : clearTimeout(timer)
        })
    })

    /* ========================== 生命周期 ========================== */

    /* -------------------------- 数据关联处理 -------------------------- */

    /* -------------------------- 表单数据同步 -------------------------- */
    /* ========================== 表单数据同步 ========================== */

    /* ========================== 数据关联处理 ========================== */

    /* -------------------------- 不同组件自定义的处理逻辑 -------------------------- */

    /* ========================== 不同组件自定义的处理逻辑 ========================== */

    // ================================定制化逻辑========================================
    onMounted(() => {
        getAreaList()
        getAllUser()
        getData()
    })
    const selectHolder = '请选择'
    const inputHolder = '请输入'
    const userInfoStorage = localStorage.getItem('al__USER_INFO')
    const taskLeader = JSON.parse(userInfoStorage)
    const state = reactive({
        searchForm: {
            time: undefined,
            areaCode: undefined,
            customerManager: undefined
        },
        dataSource: [],
        areaNameList: [],
        projectList: [],
        allUser: [],
        analysisVisible: false,
        addForm: {
            areaCode: undefined,
            factoryCode: undefined,
            productLine: undefined,
            onlineUsageRate: undefined,
            projectStatus: '状态',
            projectPhase: undefined,
            reportTime: dayjs().format('YYYY-MM-DD'),
            customerManager: taskLeader.value.name,
            visitSituation: undefined,
            projectPhaseEvents: undefined,
            trackingSituation: undefined
        },
        addVisible: false,
        tableLoading: false,
        modalTitle: '',
        productLineList: [],
        fxztList: [
            {
                label: '未构成风险',
                value: 'NO_RISK'
            },
            {
                label: '低风险',
                value: 'LOW_RISK'
            },
            {
                label: '中风险',
                value: 'MEDIUM_RISK'
            },
            {
                label: '高风险',
                value: 'HIGH_RISK'
            }
        ],
        factoryList: [],
        submitLoading: false,
        statusList: [],
        milepostList: []
    })
    function getProductLineByFactory() {
        if (!state.addForm.factoryCode) {
            state.productLineList = []
            return
        }
        get(`/solution-crm/api/v1/meeting_minutes/product_line/${state.addForm.factoryCode}`).then(data => {
            state.productLineList = data.data.map(item => {
                return {
                    label: item.productLineName,
                    value: item.productLine
                }
            })
        })
    }
    // 根据区域查工厂
    function getProjectByArea() {
        if (!state.addForm.areaCode) {
            state.factoryList = []
            return
        }
        get(`/solution-crm/api/v1/satisfaction/factory/${state.addForm.areaCode}`).then(data => {
            state.factoryList = data.data.map(item => {
                return {
                    label: item.factoryName,
                    value: item.factoryCode
                }
            })
        })
    }
    function getMilepostList() {
        get('/solution-crm/api/v1/built-in-system-ppm/dictionary/search/PROJECT_PHASE').then(data => {
            state.milepostList = data.data.map(item => {
                return {
                    label: item.dictionaryName,
                    value: item.dictionaryName
                }
            })
        }) // 问题类型
    }
    function getStatusList() {
        get('/solution-crm/api/v1/built-in-system-ppm/dictionary/search/PROJECT_STATUS').then(data => {
            state.statusList = data.data.map(item => {
                return {
                    label: item.dictionaryName,
                    value: item.dictionaryName
                }
            })
        })
    }
    const currentTab = ref('日例会')
    const tabs = ['日例会', '周例会（区域风险）', '周例会（未验收风险）', '周例会（已验收风险）']
    const allColumns = [
        {
            'dataIndex': 'areaName',
            'title': '区域',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'factoryName',
            'title': '工厂简称',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'productLineName',
            'title': '产品线',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'riskStatusStr',
            'title': '风险状态',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'visitSituation',
            'title': '项目风险',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'projectPhaseEvents',
            'title': '客情风险',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'trackingSituation',
            'title': '协同状态',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'onlineUsageRate',
            'title': '在线使用率',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'projectStatus',
            'title': '项目状态',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'projectPhase',
            'title': '项目阶段',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'planAcceptance',
            'title': '预计验收时间',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'visitSituation',
            'title': '拜访情况或协同情况',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'projectPhaseEvents',
            'title': '项目阶段事件',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'trackingSituation',
            'title': '跟踪情况',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'customerManager',
            'title': '客成经理',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'reportTime',
            'title': '汇报时间',
            'align': 'center',
            'ellipsis': true
        },
        {
            'dataIndex': 'action',
            'title': '操作',
            'align': 'center',
            'ellipsis': true
        }
    ]

    const tabColumnMap = {
        '日例会': [
            {
                'dataIndex': 'areaName',
                'title': '区域',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'factoryName',
                'title': '工厂简称',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'productLineName',
                'title': '产品线',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhase',
                'title': '项目阶段',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'visitSituation',
                'title': '拜访情况或协同情况',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhaseEvents',
                'title': '项目阶段事件',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'trackingSituation',
                'title': '跟踪情况',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'customerManager',
                'title': '客成经理',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'reportTime',
                'title': '汇报时间',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'action',
                'title': '操作',
                'align': 'center',
                'ellipsis': true
            }
        ],
        '周例会（区域风险）': [
            {
                'dataIndex': 'areaName',
                'title': '区域',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'productLineName',
                'title': '产品线',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'riskStatusStr',
                'title': '风险状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhaseEvents',
                'title': '客情风险',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'trackingSituation',
                'title': '协同状态',
                'align': 'center',
                'ellipsis': true
            },

            {
                'dataIndex': 'customerManager',
                'title': '客成经理',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'reportTime',
                'title': '汇报时间',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'action',
                'title': '操作',
                'align': 'center',
                'ellipsis': true
            }
        ],
        '周例会（未验收风险）': [
            {
                'dataIndex': 'areaName',
                'title': '区域',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'factoryName',
                'title': '工厂简称',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'productLineName',
                'title': '产品线',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhase',
                'title': '项目阶段',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectStatus',
                'title': '项目状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'planAcceptance',
                'title': '预计验收时间',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'riskStatusStr',
                'title': '风险状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'visitSituation',
                'title': '项目风险',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhaseEvents',
                'title': '客情风险',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'trackingSituation',
                'title': '协同状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'customerManager',
                'title': '客成经理',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'reportTime',
                'title': '汇报时间',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'action',
                'title': '操作',
                'align': 'center',
                'ellipsis': true
            }
        ],
        '周例会（已验收风险）': [
            {
                'dataIndex': 'areaName',
                'title': '区域',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'factoryName',
                'title': '工厂简称',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'productLineName',
                'title': '产品线',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'onlineUsageRate',
                'title': '在线使用率',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectStatus',
                'title': '项目状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'riskStatusStr',
                'title': '风险状态',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'visitSituation',
                'title': '项目风险',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'projectPhaseEvents',
                'title': '客情风险',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'trackingSituation',
                'title': '协同状态',
                'align': 'center',
                'ellipsis': true
            },

            {
                'dataIndex': 'customerManager',
                'title': '客成经理',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'reportTime',
                'title': '汇报时间',
                'align': 'center',
                'ellipsis': true
            },
            {
                'dataIndex': 'action',
                'title': '操作',
                'align': 'center',
                'ellipsis': true
            }
        ]
    }

    const tableColumns = computed(() => {
        const config = tabColumnMap[currentTab.value] || []

        return config
            .map(({ title, dataIndex }) => {
                return allColumns.find(col => col.dataIndex === dataIndex && col.title === title)
            })
            .filter(Boolean) // 防止找不到返回 undefined
    })

    const addRule = {
        areaCode: [{ required: true, message: '请选择区域', trigger: 'blur' }],
        factoryCode: [{ required: true, message: '请选择工厂', trigger: 'blur' }],
        productLine: [{ required: true, message: '请选择产品线', trigger: 'blur' }],
        riskStatus: [{ required: true, message: '请选择风险状态', trigger: 'blur' }],
        projectPhase: [{ required: true, message: '请选择项目阶段', trigger: 'blur' }],
        reportTime: [{ required: true, message: '请选择汇报时间', trigger: 'blur' }],
        customerManager: [{ required: true, message: '请选择客成经理', trigger: 'blur' }],
        projectStatus: [{ required: true, message: '请选择项目状态', trigger: 'blur' }],
        visitSituation: [{ required: true, message: '请输入拜访情况或协同情况', trigger: 'blur' }],
        projectPhaseEvents: [{ required: true, message: '请输入项目阶段事件', trigger: 'blur' }],
        trackingSituation: [{ required: true, message: '请输入跟踪情况', trigger: 'blur' }]
    }
    function tabChange() {
        state.dataSource = []
        pagination.value.current = 1
        pagination.value.pageSize = 10
        getData()
    }
    const tabMap = {
        '日例会': 'DAILY_MEETING',
        '周例会（区域风险）': 'WEEKLY_MEETING',
        '周例会（未验收风险）': 'UNACCEPTED_WEEKLY_MEETING',
        '周例会（已验收风险）': 'ACCEPTED_WEEKLY_MEETING'
    }
    function getData() {
        state.tableLoading = true
        post('/solution-crm/api/v1/meeting_minutes/search', {
            'pageNumber': pagination.value.current,
            'pageSize': pagination.value.pageSize,
            'meetingType': tabMap[currentTab.value],
            'customerManager': state.searchForm.customerManager,
            'reportTime': state.searchForm.time,
            areaCode: state.searchForm.areaCode
        })
            .then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    state.dataSource = []
                    return
                }
                state.dataSource = data.data.content
                pagination.value.total = data.data.totalElements
            })
            .finally(() => {
                state.tableLoading = false
            })
    }
    function resetData() {
        state.searchForm.areaCode = state.searchForm.customerManager = state.searchForm.time = undefined
        getData()
    }
    // 区域
    function getAreaList() {
        get('/solution-crm/api/v1/satisfaction/area').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            state.areaNameList = data.data.map(item => {
                return {
                    label: item.areaName,
                    value: item.areaCode
                }
            })
        })
    }
    function getAllUser() {
        get('/solution-crm/api/v1/satisfaction/user').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            state.allUser = data.data.userDtoList.map(item => {
                return {
                    label: item.name,
                    value: item.name
                }
            })
        })
    }
    // 分页方法
    const pageSizeChange = (current, size) => {
        pagination.value.current = current
        pagination.value.pageSize = size
        getData()
    }
    const pageChange = (page, pageSize) => {
        pagination.value.current = page
        pagination.value.pageSize = pageSize
        getData()
    }
    const pagination = ref({
        current: 1,
        pageSize: 10,
        showSizeChanger: true,
        showQuickJumper: true,
        total: '0',
        pageSizeOptions: ['5', '10', '20', '30', '40', '100'],
        showTotal: total =>
            `共 ${total} 个项目 第${pagination.value.current}/${Math.ceil(
                pagination.value.total / pagination.value.pageSize
            )}页`,
        onShowSizeChange: pageSizeChange,
        onChange: pageChange
    })

    function confirmMeet(record) {
        record.isEdit = false
    }
    function showAdd() {
        state.modalTitle = `新建${currentTab.value}`
        state.addForm.customerManager = taskLeader.value.name
        state.addForm.reportTime = dayjs().format('YYYY-MM-DD')
        currentData.value = {
            areaCode: undefined,
            factoryCode: undefined,
            productLine: undefined,
            onlineUsageRate: undefined,
            projectStatus: '状态',
            projectPhase: undefined,
            reportTime: dayjs().format('YYYY-MM-DD'),
            customerManager: taskLeader.value.name,
            visitSituation: undefined,
            projectPhaseEvents: undefined,
            trackingSituation: undefined
        }
        state.addVisible = true
    }
    function cancelMeet() {
        state.addVisible = false
        currentData.value = {}
        state.addForm = {}
    }
    const addRef = ref(null)
    const currentData = ref({})
    function confirmAdd() {
        addRef.value.validate().then(() => {
            const api = currentData.value.id ? put : post
            state.submitLoading = true
            api('/solution-crm/api/v1/meeting_minutes', { ...state.addForm, meetingType: tabMap[currentTab.value] })
                .then(data => {
                    if (data.code !== 200) {
                        message.error(data.message)
                        return
                    }
                    message.success(data.message)
                    cancelMeet()
                    getData()
                })
                .finally(() => {
                    state.submitLoading = false
                })
        })
    }
    function handleEdit(record) {
        state.modalTitle = `编辑${currentTab.value}`

        get(`/solution-crm/api/v1/meeting_minutes/${record.id}`).then(async data => {
            Object.assign(state.addForm, data.data)
            await getAreaList()
            if (data.data.areaCode) {
                await getProjectByArea()
            }
            if (data.data.factoryCode) {
                await getProductLineByFactory()
            }
            state.addVisible = true
            currentData.value = data.data
        })
    }
    function deleteRecord(id) {
        del(`/solution-crm/api/v1/meeting_minutes/${id}`).then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            message.success(data.message)
            getData()
        })
    }
</script>
<style lang="less" scoped>
    .page_root {
        width: 100%;
        height: 100%;
        overflow: auto;
    }
    .page_root :deep(.@{ant-prefix}-spin-nested-loading),
    .page_root :deep(.@{ant-prefix}-spin-container) {
        height: 100%;
    }
    .page_root :deep(.@{ant-prefix}-spin-container .@{ant-prefix}-table-wrapper) {
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-start;
    }
    .page_root :deep(.@{ant-prefix}-table) {
        flex: auto;
        overflow: auto;
    }
    .table-moreBtn_down {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100px;
    }

    .table-moreBtn_menu :deep(.table-moreBtn_menu-item):hover {
        background: #ebf1ff;
    }

    /*  表格树结构样式处理，展开按钮层级增加*/
    :deep(.@{ant-prefix}-table-row-expand-icon) {
        z-index: 1;
    }
    /*  表格树结构 由于每个表格项采用自定义组件，使用绝对定位布局，开启树结构导致显示异常，暂时使用层级定位位置 */
    :deep(.@{ant-prefix}-table-row-level-1 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 15px !important;
        width: calc(100% - 15px);
    }
    :deep(.@{ant-prefix}-table-row-level-2 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 30px !important;
        width: calc(100% - 30px);
    }
    :deep(.@{ant-prefix}-table-row-level-3 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 45px !important;
        width: calc(100% - 45px);
    }
    :deep(.@{ant-prefix}-table-row-level-4 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 60px !important;
        width: calc(100% - 60px);
    }

    /* 穿梭框改变默认样式，为根据组件样式控制左右栏宽度。 */
    :deep(.@{ant-prefix}-transfer-list) {
        height: 100%;
        width: 50%;
    }

    /*样式*/
    .body {
        height: 100%;
    }
    .top-search {
        padding: 24px 24px 0 24px;
        border-radius: 4px;
        background-color: #fff;
        margin-bottom: 16px;
    }
    .content {
        padding: 12px 24px;
        background-color: #fff;
        border-radius: 4px;
        height: 100%;
    }
    .table-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 16px;
    }
    .tip {
        font-size: 16px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 600;
        line-height: 16px;
        border-left: 4px solid #3875ff;
        padding-left: 4px;
        height: 16px;
    }
    .kb-table-box:deep(.@{ant-prefix}-table-thead) > tr > th {
        background: #3875ff;
        color: #fff;
        font-weight: 600;
        padding: 8px 16px;
        border-right: 1px solid #d9d9d9 !important;
        position: relative;
    }
    .kb-table-box :deep(.@{ant-prefix}-table-tbody) tr > td {
        font-size: 14px;
        font-family: arial, helvetica, 'microsoft yahei';
        font-weight: 400;
        color: #262626;
        border-bottom: 1px solid #d9d9d9;
        padding: 8px 16px;
        word-break: break-all;
    }
    .modal-form :deep(.ant3-form-item-label) {
        width: 120px;
    }
</style>
